<style lang="less">
    @import '../../styles/common.less';
    @import '../tables/components/table.less';
    .ivu-card-head-inner, .ivu-card-head p{
    	height: 32px;
    }
</style>

<template>
    <div>
        <Row class="margin-top-10">
            <Col span="24">
                <Card>
                    <p slot="title">
                        <Input v-model="keyword" placeholder="请输入名称搜搜..." style="width: 200px" />
                        <span @click="handleSearch3" style="margin: 0 10px;"><Button type="primary" icon="search">搜索</Button></span>
                        <Button @click="handleCancel3" type="ghost" >取消</Button>
                    	<span style="margin: 0 10px;float: right;"><Button type="primary" icon="android-add" @click="add">新增</Button></span>
                    </p>
                    <Row :gutter="10">
                        <Col span="24">
                            <div>
                                <can-edit-table 
                                    refs="table4" 
                                    v-model="editInlineAndCellData" 
                                    @on-edit="edit"
                                    @on-detail="detail"
                                    @on-delete="deletes"
                                    :columns-list="editInlineAndCellColumn"
                                ></can-edit-table>
                                
                            </div>
                            
                        </Col>
					    <Modal v-model="modal1"
					    	:width="800"
					        :title="getModelTital"
					        @on-ok="ok"
					        @on-cancel="cancel">
					        <Form :model="formItem">
						        <FormItem label="车队名称">
						            <Row>
						                <Col span="8">
						                    <Input style="width: 260px" v-model="formItem.teamName" placeholder="请输入车队名称"></Input>
						                </Col>
						                <Col span="4" style="text-align: right;padding-right: 20px;">参赛单位</Col>
						                <Col span="8">
						                    <Input style="width: 260px" v-model="formItem.teamOrganization" placeholder="请输入参赛单位"></Input>
						                </Col>
						            </Row>
						        </FormItem>
						        <FormItem label="参赛车数">
						            <Row>
						                <Col span="8">
						                    <Input style="width: 260px" v-model="formItem.automobileQuantity" placeholder="请输入参赛数量"></Input>
						                </Col>
						                <Col span="4" style="text-align: right;padding-right: 20px;">参赛人数</Col>
						                <Col span="8">
						                    <Input style="width: 260px" v-model="formItem.matchesNumber" placeholder="请输入参赛人数"></Input>
						                </Col>
						            </Row>
						        </FormItem>
								<FormItem label="车队编号">
						            <Row>
						                <Col span="8">
						                	<Input style="width: 260px" v-model="formItem.teamLotNo" placeholder="请输入车队编号"></Input>
						                </Col>
						                <Col span="5" style="text-align: right;padding-right: 10px;">属否参加离线测试</Col>
						                <Col span="6">
						                    <RadioGroup v-model="formItem.offlineTest">
								                <Radio label="Y">参加</Radio>
								                <Radio label="N">不参加</Radio>
								            </RadioGroup>
						                </Col>
						            </Row>
						        </FormItem>
						        <FormItem label="联系人员">
						            <Row>
						                <Col span="8">
						                    <Input style="width: 260px" v-model="formItem.teamLeader" placeholder="请输入联系人"></Input>
						                </Col>
						                <Col span="4" style="text-align: right;padding-right: 20px;">联系方式</Col>
						                <Col span="8">
						                    <Input style="width: 260px" v-model="formItem.teamPhone" placeholder="请输入联系方式"></Input>
						                </Col>
						            </Row>
						        </FormItem>
						        <FormItem label="负责人职务">
						            <Row>
						                <Col span="8">
						                	<Input style="width: 250px" v-model="formItem.duty" placeholder="请输入职务"></Input>
						                </Col>
						                <Col span="4" style="text-align: right;padding-right: 20px;">负责人性别</Col>
						                <Col span="8">
						                    <RadioGroup v-model="formItem.gender">
								                <Radio label="0">男</Radio>
								                <Radio label="1">女</Radio>
								            </RadioGroup>
						                </Col>
						            </Row>
						        </FormItem>
						        <FormItem label="负责人邮箱">
						            <Row>
						                <Col span="8">
						                    <Input style="width: 250px" v-model="formItem.email" placeholder="请输入邮箱"></Input>
						                </Col>
						                <Col span="5" style="text-align: right;padding-right: 30px;">负责人办公电话</Col>
						                <Col span="8">
						                    <Input style="width: 220px" v-model="formItem.officePhone" placeholder="请输入电话"></Input>
						                </Col>
						            </Row>
						        </FormItem>
						        <FormItem label="赛车车长(毫米)">
						            <Row>
						                <Col span="8">
						                    <Input style="width: 230px" v-model="formItem.automobileLength" placeholder="请输入长度"></Input>
						                </Col>
						                <Col span="4" style="text-align: right;padding-right: 20px;">赛车车宽(毫米)</Col>
						                <Col span="8">
						                    <Input style="width: 230px" v-model="formItem.automobileWidth" placeholder="请输入宽度"></Input>
						                </Col>
						            </Row>
						        </FormItem>
						        <FormItem label="赛车车高(毫米)">
						            <Row>
						                <Col span="8">
						                    <Input style="width: 230px" v-model="formItem.automobileHeight" placeholder="请输入高度"></Input>
						                </Col>
						            </Row>
						        </FormItem>
						        <FormItem label="离去角(度)">
						            <Row>
						                <Col span="8">
						                    <Input style="width: 260px" v-model="formItem.departureAngle" placeholder="请输入离去角"></Input>
						                </Col>
						                <Col span="4" style="text-align: right;padding-right: 20px;">接近角(度)</Col>
						                <Col span="8">
						                    <Input style="width: 260px" v-model="formItem.approachAngle" placeholder="请输入接近角"></Input>
						                </Col>
						            </Row>
						        </FormItem>
						        <FormItem label="轮距(毫米)">
						            <Row>
						                <Col span="8">
						                    <Input style="width: 260px" v-model="formItem.wheelTrack" placeholder="请输入轮距"></Input>
						                </Col>
						                <Col span="4" style="text-align: right;padding-right: 20px;">轴距(毫米)</Col>
						                <Col span="8">
						                    <Input style="width: 260px" v-model="formItem.wheelBase" placeholder="请输入轴距"></Input>
						                </Col>
						            </Row>
						        </FormItem>
						        <FormItem label="最小离地间隙(毫米)">
						            <Row>
						                <Col span="8">
						                    <Input style="width: 210px" v-model="formItem.minGroundClearance" placeholder="请输入最小离地间隙"></Input>
						                </Col>
						                <Col span="4" style="text-align: right;padding-right: 20px;">最小转弯半径(毫米)</Col>
						                <Col span="8">
						                    <Input style="width: 210px" v-model="formItem.minTurningRadius" placeholder="请输入最小转弯半径"></Input>
						                </Col>
						            </Row>
						        </FormItem>
						        <FormItem label="自主行驶最高车速">
						            <Row>
						                <Col span="8">
						                    <Input style="width: 220px" v-model="formItem.maxSpeed" placeholder="请输入最高车速"></Input>
						                </Col>
						                <Col span="4" style="text-align: right;padding-right: 20px;">自主行驶最低车速</Col>
						                <Col span="8">
						                    <Input style="width: 220px" v-model="formItem.minSpeed" placeholder="请输入最低车速"></Input>
						                </Col>
						            </Row>
						        </FormItem>
						        <FormItem>
						        	<Row>
						                <Col span="12">
						                    <template>
											    <Upload
											    	:on-success="frontView"
											    	action="http://60.205.229.131:8085/mark/v2/uploadimg">
											        <Button type="ghost"  icon="ios-cloud-upload-outline">前视图</Button>
											    </Upload>
											</template>
						                </Col>
						                <Col span="8">
						                    <template>
											    <Upload 
											    	:on-success="lateralView"
											    	action="http://60.205.229.131:8085/mark/v2/uploadimg">
											        <Button type="ghost"  icon="ios-cloud-upload-outline">俯视图</Button>
											    </Upload>
											</template>
						                </Col>
						            </Row>
						        	
						        </FormItem>
						    </Form>
					    </Modal>
                    </Row>
                </Card>
            </Col>
        </Row>
    </div>  
</template>

<script>
import 'jquery';
import tableData from './participating.js';
import canEditTable from '../components/canEditTable.vue';
import {adminId,accessToken} from '../components/date.js';
import {baseurl} from '../../libs/util';

export default {
    name: 'editable-table',
    components: {
        canEditTable
    },
    data () {
        return {
        	keyword:'',
            tableData: [],
            editInlineAndCellColumn: [],
            editInlineAndCellData: [],
            modal1: false,
	        formItem: {},
	        flag: 'add'
        };
    },
    mounted:function(){
		this.team();
	},
	computed: {
	    getModelTital: function () {
	      return this.flag === 'add'?'添加车队信息':'修改车队信息';
	    }
  	},
    methods: {
    	//初始化
    	team : function(pageNo){
    		pageNo = pageNo || 1;
    		var _self=this;
		  	$.ajax({
	  			url : baseurl+'v2/users/'+adminId+'/teams',
				type : 'get',
				data:{
					"currentPage":pageNo,
					"pageSize":60,
					"keyword":_self.keyword,
				},
				dataType : 'json',
				success : function(data) {
					_self.dataObj = {}; 
					var result = data.result;
					_self.dataObj = result;
		            _self.editInlineAndCellData = _self.dataObj;
		            _self.total = data.totalNum;
				}
	  		});
		},
        getData () {
            this.tableData = tableData.table1Data;
            this.editInlineAndCellColumn = tableData.editInlineAndCellColumn;
        },
        //新增
        add(e){
        	this.modal1 = true ;
        	this.flag ='add';
        },
        //编辑
        edit (e) {
        	this.flag ='';
        	this.modal1 = true;
        	this.formItem = e;
        },
        frontView (res, file) {
            this.formItem.frontView = res.path;
        },
        lateralView(res){
        	this.formItem.lateralView = res.path;
        },
        detail(data){
        	console.log(data)
            this.$router.push({
                name: 'partDetali',
                query: {
                	//row:JSON.stringify(data),
                	teamId: data.teamId
                }
            });
        },
       	//删除
        deletes (e) {
        	var th=this;
            $.ajax({
	  			type: "DELETE",
	  			url:baseurl+'users/'+adminId+'/teams/'+e.teamId,
	  			async: false,
	  			dataType: 'json',
				contentType: "application/json; charset=utf-8",
	  			beforeSend: function(request) {
					request.setRequestHeader("accessToken", accessToken);
				},
				success: function(data) {
					
					if(data.code == 1){
						th.$Message.success('删除成功');
						th.team();//刷新
					}else{
						th.$Message.error('删除失败');
					}
				}
	  		});
        },
        //搜索
        handleSearch3 () {
        	this.team();
        },
        //取消
        handleCancel3 (i) {
        	this.keyword = '';
        	this.team();
        },
        //提交
        ok () {
        	console.log(this.formItem)
	  		var th = this;
	  		$.ajax({
	  			type: "POST",
	  			url:baseurl+'users/'+adminId+'/teams',
	  			dataType: 'json',
	  			data: JSON.stringify(this.formItem),
	  			async: false,
				contentType: "application/json; charset=utf-8",
	  			beforeSend: function(request) {
					request.setRequestHeader("accessToken", accessToken);
				},
				success: function(data) {
					if(data.code == 1){
						th.$Message.success('更改成功');
						th.team();//刷新
						th.formItem = {}; 
					}else{
						th.$Message.error('更改失败');
					}
				}
	  		});
       },
        cancel () {
            this.formItem = '';
        }
    },
    created () {
        this.getData();
    }
};
</script>
